.app-courseDetails {
	height: 100%;
	width: 100%;
	.video-box {
		width: 100%;
		height: 35%;
		position: relative;
		.btn-return {
			position: absolute;
			top: 12px;
			left: 12px;
			font-weight: bold;
			font-size: 24px;
			z-index: 1;
		}
		video {
			height: 100%;
			width: 100%;
			object-fit: fill;
		}
		.play-box {
			position: absolute;
			z-index: 100;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
			text-align: center;
			.btn-play {
				font-size: 28px;
			}
		}
	}
	.details {
		padding: 20px 15px;
		.num-box {
			justify-content: space-between;
			border-bottom: 1px solid #cdcdcd;

			.hot-num-text,
			.minute-num-text {
				font-weight: bold;
			}
			.units-text {
				color: #888;
			}
		}
	}
	.user-mess {
		align-items: center;
		img {
			width: 60px;
			height: 60px;
			border-radius: 50%;
			margin-left: 5px;
		}
		.user-details {
			.name-text {
				font-weight: bold;
				font-size: 16px;
			}
			.mess {
				color: #777;
			}
		}
		button {
			border-radius: 15px;
			background-color: #4294ff;
			padding: 6px 14px;
		}
	}
	.details-text {
		color: #777;
		line-height: 1.8;
		span {
			color: black;
		}
	}
	.method-box {
		div {
			&:nth-child(1) {
				border-right: 1px dashed #ccc;
			}
		}
		i {
			margin-right: 5px;
			font-size: 18px;
			&.ico2 {
				font-size: 24px;
				vertical-align: middle;
			}
		}

		p {
			color: #999;
		}
	}
	.training-box {
		padding: 38px 15px 0px;
		.btn-training {
			background-color: #4294ff;
			height: 43px;
			border-radius: 20px;
			width: 100%;
		}
	}
}
